<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>天气预报演示</title>
</head>
<body ng-app="Weather">

    <div ng-controller="WeatherController">
        <table>
            <tr ng-repeat="(key,weather) in weathers">
                <td>{{key}}</td>
                <td>{{weather.date}}</td>
                <td><img ng-src="{{weather.dayPictureUrl}}" ></td>
                <td><img ng-src="{{weather.nightPictureUrl}}"></td>
                <td>{{weather.weather}}</td>
            </tr>
        </table>
    </div>

    <!--资料版本$http方法能用，翻墙下载不能用-->
    <script src="./lib/angular.min.js"></script>
    <script>
        var Weather = angular.module('Weather',[]);
        Weather.controller('WeatherController',['$scope','$http',function ($scope,$http) {

            $http({
                url:'http://api.map.baidu.com/telematics/v3/weather',
                method:'jsonp',
                params:{
                    //请求参数
                    location:'北京',
                    output:'json',
                    ak:'0A5bc3c4fb543c8f9bc54b77bc155724',
                    callback:'JSON_CALLBACK'
                }
            }).success(function (data) {
                console.log(data);
                $scope.weathers = data.results[0].weather_data;

            });
        }])

    </script>
</body>
</html>